<template>
  <div>
    <div>
      <div class="orderHeader" style="margin: 5px 0px 0px 0px">
        <div class="orderSearch">
          <!-- <el-collapse accordion ref="coll">
            <el-collapse-item>
              <template slot="title">
                <el-form
                  ref="form"
                  :model="orderSearch"
                  :inline="true"
                  @submit.native.prevent
                >
                  <el-form-item label="运单号">
                    <el-input
                        id="waybill_no_search"
                      v-model="orderSearch.waybill_no"
                      @click.stop.native
                      style="width: 200px"
                      placeholder="支持批量搜索,多个单号用逗号分隔"
                      @keyup.enter.native="submitForm"
                      @focus="titleFocus"
                      @blur="titleBlur"
                    />
                  </el-form-item>

                  <el-form-item size="mini">
                    <el-button
                        id="go_search"
                      type="primary"
                      @click.stop.native
                      icon="el-icon-search"
                      @click="handleSearch"
                      data-tracker="P7-1"
                      >查询</el-button
                    >
                    <el-button
                      type="primary"
                      @click.stop.native
                      plain
                      icon="el-icon-refresh"
                      @click="handleReset"
                      data-tracker="P7-2"
                      >重置</el-button
                    >
                  </el-form-item>
                </el-form>
              </template>
              <template>
                <el-form ref="form" :model="orderSearch" :inline="true">
                  <el-form-item label="超温预警" size="mini">
                    <el-select
                      v-model="orderSearch.is_over_temperature"
                      style="width: 200px"
                      @click.stop.native
                    >
                      <el-option
                        v-for="(item, index) in options"
                        :key="index"
                        :label="item.label"
                        :value="item.value"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="创建时间" size="mini">
                    <el-date-picker
                      v-model="orderSearch.time"
                      :default-time="['00:00:00', '23:59:59']"
                      type="daterange"
                      align="right"
                      unlink-panels
                      range-separator="至"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期"
                      :picker-options="pickerOptions"
                      clearable
                      style="width: 300px"
                      size="mini"
                      value-format="timestamp"
                      @change="handleDateChange"
                    />
                  </el-form-item>
                  <el-form-item label="发货人">
                    <el-input
                      v-model="orderSearch.sender_name"
                      placeholder="请输入发货人"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="发货人手机号">
                    <el-input
                      v-model="orderSearch.sender_phone"
                      placeholder="请输入发货人手机号"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="发货城市">
                    <el-cascader
                      style="width: 230px"
                      :options="areaData2"
                      filterable
                      clearable
                      v-model="sender_city_id"
                      placeholder="请选择省市区"
                      :props="{
                        value: 'id',
                        label: 'name',
                        children: 'next_level_data',
                      }"
                    ></el-cascader>
                  </el-form-item>
                  <el-form-item label="所属客户">
                    <el-select
                      placeholder="所属客户"
                      style="width: 220px"
                      filterable
                      remote
                      reserve-keyword
                      clearable
                      :remote-method="searchCustomerList"
                      v-model="customer_id"
                    >
                      <el-option
                        v-for="item in customerList"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                      >
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <el-form-item label="客户所属大区">
                    <el-select
                      style="width: 230px"
                      placeholder="请选择客户所属大区"
                      @change="$forceUpdate()"
                      filterable
                      clearable
                      v-model="orderSearch.customer_arae"
                    >
                      <el-option
                        v-for="website in websiteListDQ"
                        :key="website.id"
                        :label="website.name"
                        :value="website.id"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="收货人">
                    <el-input
                      v-model="orderSearch.receiver_name"
                      placeholder="发货人"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="收货人手机号">
                    <el-input
                      v-model="orderSearch.receiver_phone"
                      placeholder="发货人手机号"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="收货城市">
                    <el-cascader
                      style="width: 230px"
                      :options="areaData2"
                      filterable
                      clearable
                      v-model="receiver_city_id"
                      placeholder="请选择省市区"
                      :props="{
                        value: 'id',
                        label: 'name',
                        children: 'next_level_data',
                      }"
                    ></el-cascader>
                  </el-form-item>
                  <el-form-item label="收货公司">
                    <el-input
                      v-model="orderSearch.receiver_company"
                      placeholder="收货公司"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="出发区域">
                    <el-select
                      style="width: 230px"
                      @change="$forceUpdate()"
                      v-model="orderSearch.from_area_id"
                      filterable
                    >
                      <el-option
                        v-for="website in websiteListDQ"
                        :key="website.id"
                        :label="website.name"
                        :value="website.id"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="目的区域">
                    <el-select
                      style="width: 230px"
                      @change="$forceUpdate()"
                      v-model="orderSearch.to_area_id"
                      filterable
                    >
                      <el-option
                        v-for="website in websiteListDQ"
                        :key="website.id"
                        :label="website.name"
                        :value="website.id"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="出发网点">
                    <el-cascader
                      v-model="orderSearch.from_network_id"
                      :options="organizationBoxData"
                      :props="propsBranchType"
                      :show-all-levels="false"
                      filterable
                      clearable
                    >
                    </el-cascader>
                  </el-form-item>
                  <el-form-item label="目的网点">
                    <el-cascader
                      v-model="orderSearch.to_network_id"
                      :options="organizationBoxData"
                      :props="propsBranchType"
                      :show-all-levels="false"
                      filterable
                      clearable
                    >
                    </el-cascader>
                  </el-form-item>
                  <el-form-item label="承运类型">
                    <el-select
                      style="width: 195px"
                      clearable
                      multiple
                      v-model="orderSearch.waybill_product_type"
                    >
                      <el-option
                        v-for="type in transportsType"
                        :key="type.id"
                        :label="type.name"
                        :value="type.id"
                      />
                    </el-select>
                  </el-form-item>
                  <el-form-item label="发站">
                    <el-input
                      v-model="orderSearch.from_region_name"
                      placeholder="发站"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="到站">
                    <el-input
                      v-model="orderSearch.to_region_name"
                      placeholder="到站"
                      style="width: 230px"
                    />
                  </el-form-item>
                  <el-form-item label="创建人">
                    <el-select
                      style="width: 195px"
                      clearable
                      v-model="creator_id"
                      filterable
                      placeholder="创建人"
                    >
                      <el-option
                        v-for="type in creator_List"
                        :key="type.id"
                        :label="type.username"
                        :value="type.id"
                      />
                    </el-select>
                  </el-form-item>
                </el-form>
              </template>
            </el-collapse-item>
          </el-collapse> -->
        </div>
      </div>
    </div>
    <div class="actions" style="margin-bottom: 10px">
      <div class="left">
        <el-button
          id="dispatch_create_button"
          data-tracker="P6-1"
          type="primary"
          plain
          size="mini"
          @click="handleClickCreate"
          v-permission="'dispatch_create'"
          >创建干线单</el-button
        >
        <el-dropdown
          v-permission="'dispatch_import_update'"
          @command="handleWaybillMessage"
          divided
          class="operation-drop"
        >
          <el-button type="primary" plain>
            导入<i class="el-icon-arrow-down el-icon--right"></i>
          </el-button>
          <el-dropdown-menu
            class="operation-drop"
            slot="dropdown"
            style="width: 150px"
          >
            <el-dropdown-item command="2">修改干线单信息</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <el-button
          type="primary"
          :loading="isLoading"
          plain
          size="mini"
          @click="handleExport()"
          v-permission="'dispatch_stay_export'"
          >导出</el-button
        >
      </div>
      <div class="right" style="display: flex">
        <!-- <el-pagination
          small
          :current-page="paginations.pageIndex"
          :page-sizes="paginations.pageSizes"
          :page-size="paginations.pageSize"
          :layout="paginations.layout"
          :total="paginations.total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        /> -->
        <el-button
          type="primary"
          @click.stop.native
          icon="el-icon-refresh"
          @click="handleReset"
          data-tracker="P7-2"
          style="margin-right: 10px"
          >重置</el-button
        >
        <SettinUp
          :settype="1"
          :objSettinUpdata="objSettinUp"
          key="1"
        ></SettinUp>
      </div>
    </div>
    <div v-if="header_data_list.length > 0">
      <TableHeader
        ref="TableHeaderList"
        :header_data_list="header_data_list"
        :HeaderData="HeaderData"
        :propMap="propMap"
        :objheader="objheader"
        @childEvent="handleDelete"
        @orderIdNumsEvent="handleDeleteType"
      ></TableHeader>
    </div>
    <div class="rightArea" style="margin: 10px 0px 10px 0px">
      <el-pagination
        small
        background
        :current-page="paginations.pageIndex"
        :page-sizes="paginations.pageSizes"
        :page-size="paginations.pageSize"
        :layout="paginations.layout"
        :total="paginations.total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </div>
    <!-- <el-table
        id="filter_box"
      ref="multipleTableTrunkline"
      :row-key="(item) => item.id"
      :data="orders"
      border
      stripe
      align="center"
      @selection-change="handleSelectionChange"
      style="width: 100%"
      :cell-style="rowStyle"
    >
      <el-table-column type="selection" width="45" :reserve-selection="true">
      </el-table-column>
      <el-table-column
        prop=""
        fixed
        label="序号"
        width="50"
        type="index"
      ></el-table-column>
      <el-table-column prop="waybill_no" fixed label="运单号" width="180">
        <template slot-scope="scope">
          <span style="cursor: pointer; color: blue" @click="handleJump(scope)"
            >{{ scope.row.waybill_no }}
          </span>
        </template>
      </el-table-column>
      <el-table-column prop="receiver_company" label="收货公司" width="180">
      </el-table-column>
      <el-table-column prop="receiver_name" label="收货人" width="180">
      </el-table-column>
      <el-table-column prop="receiver_phone" label="收货人手机号" width="180">
      </el-table-column>
      <el-table-column prop="receiver_address" label="收货地址" width="260">
      </el-table-column>
      <el-table-column
        prop="waybill_product_type_name"
        label="承运类型"
        width="120"
      >
      </el-table-column>
      <el-table-column prop="status" label="运单状态" width="100">
        <template slot-scope="scope">
          {{ statusArr[scope.row.status] }}
        </template>
      </el-table-column>
      <el-table-column prop="from_area_name" label="出发区域" width="180">
      </el-table-column>
      <el-table-column prop="to_area_name" label="目的区域" width="180">
      </el-table-column>
      <el-table-column prop="from_network_name" label="出发网点" width="180">
      </el-table-column>
      <el-table-column prop="to_network_name" label="目的网点" width="180">
      </el-table-column>
      <el-table-column prop="sender_company" label="发货公司" width="180">
      </el-table-column>
      <el-table-column prop="sender_name" label="发货人" width="180">
      </el-table-column>
      <el-table-column prop="sender_phone" label="发货人手机号" width="180">
      </el-table-column>
      <el-table-column prop="sender_address" label="发货地址" width="260">
      </el-table-column>

      <el-table-column prop="create_time" label="创建时间" width="180">
        <template slot-scope="scope">
          <span v-time="scope.row.create_time"></span>
        </template>
      </el-table-column>
      <el-table-column prop="total_goods_cnt" label="总件数" width="80">
      </el-table-column>
      <el-table-column prop="thermosphere_name" label="温层" width="140">
      </el-table-column>
      <el-table-column prop="from_region_name" label="发站" width="180">
      </el-table-column>
      <el-table-column prop="to_region_name" label="到站" width="100">
      </el-table-column>
      <el-table-column prop="router" label="路由" width="180">
      </el-table-column>
      <el-table-column prop="handler_name" label="经办人" width="100">
      </el-table-column>
      <el-table-column prop="total_freight" label="总运费" width="100">
      </el-table-column>
      <el-table-column prop="receipt_count" label="客户回单" width="80">
        <template slot-scope="scope">
          {{
            scope.row.receipt_count === "1" || scope.row.receipt_count === "3"
              ? "是"
              : "否"
          }}
        </template>
      </el-table-column>
      <el-table-column prop="receipt_count" label="我司回单" width="80">
        <template slot-scope="scope">
          {{
            scope.row.receipt_count === "2" || scope.row.receipt_count === "3"
              ? "是"
              : "否"
          }}
        </template>
      </el-table-column>
      <el-table-column prop="remark" label="备注" width="180">
      </el-table-column>
      <el-table-column prop="last_editor_name" label="操作人" width="100">
      </el-table-column>
      <el-table-column prop="customer_id_name" label="所属客户" width="100">
      </el-table-column>
      <el-table-column
        prop="customer_area_name"
        label="客户所属大区"
        show-overflow-tooltip
        width="120"
      >
      </el-table-column>
      <el-table-column prop="update_time" label="操作时间" width="180">
        <template slot-scope="scope">
          <span v-time="scope.row.update_time"></span>
        </template>
      </el-table-column>
    </el-table> -->
    <StepOperation
      mode="add"
      :showDialog="showDialog"
      :ids="checkedOrders.map(Number)"
      step="2"
      @closeDialog="handleCloseDialog"
    ></StepOperation>
    <ImportTrunkline
      :drawertrunklineData="drawertrunklineFlagShow"
      @drawertrunklineShow="drawertrunklineFlagShowFn"
    ></ImportTrunkline>
  </div>
</template>
<script>
import {
  stayList,
  reqWebsiteList, //
  getTransportsList,
  reqHandlersList,
  waybillDispatchStayExport,
} from "@/api/waybill";
import TableHeader from "@/page/orderform/components/TableHeader/tableheader.vue";
import SettinUp from "@/page/orderform/components/settingUp/settingUp.vue";
import StepOperation from "./components/stepOperation.vue";
import { regionList } from "@/page/material/common/common"; // 地址库接口
import { organizationBox } from "@/api/organization";
import { timestamp10 } from "@/utils/mUtils";
import { customerPeople } from "@/api/information";
import ImportTrunkline from "../../components/waybillPop/ImportTrunkline.vue";
import { sendClickTracker } from "@/utils/tracker";

export default {
  name: "tobedelivered",
  components: { StepOperation, ImportTrunkline, TableHeader, SettinUp },
  data() {
    return {
      orders: [],
      paginations: {
        pageIndex: 1, // 当前位于哪页
        pageSize: 20, // 1页显示多少条
        pageSizes: [10, 20, 50, 100], //每页显示多少条
        total: 200,
        layout: "total, sizes, prev, pager, next, jumper", // 翻页属性
      },
      checkedOrders: [],
      showDialog: false,
      // maxheight: 400,
      orderSearch: {
        waybill_no: "",
        status: "",
        is_over_temperature: "",
        create_time: {
          start_time: 1664553600000,
          end_time: new Date().getTime(),
        },
        time: [1664553600000, new Date().getTime()],
        sender_name: "", //发货人
        sender_phone: "", //发货人手机号
        receiver_name: "", //收货人
        receiver_phone: "", //收货人手机号
        receiver_company: "", //收货人公司
        from_network_id: [[]], //出发网点
        to_network_id: [[]], //目的网点
        from_area_id: "",
        to_area_id: "",
        customer_arae: "",
      },
      from_network_id: [[]], //出发网点
      to_network_id: [[]], //目的网点
      statusArr: [
        "待揽收",
        "揽收中",
        "待创建干线",
        "待发车",
        "已发车",
        "待配送",
        "配送中",
        "待签收",
        "待回单",
        "待回单签收",
        "已完结",
      ], //运单状态
      options: [
        {
          value: "",
          label: "全部",
        },
        {
          value: "1",
          label: "超温",
        },
        {
          value: "2",
          label: "即将超温",
        },
        {
          value: "0",
          label: "正常",
        },
      ], //是否超温
      customer_id: "", //选中的地址
      customerList: [], //所属客户
      websiteListDQ: [],
      areaData2: [], //二级地址库
      sender_city_id: [], ////发货人城市
      receiver_city_id: [], //收货人公司城市
      organizationBoxData: [],
      propsBranchType: {
        emitPath: true,
        checkStrictly: true,
        value: "id",
        label: "branch_name",
        children: "next_level_data",
      },
      transportsType: [], //承运类型
      creator_id: "", //创建人
      creator_List: [], //创建人列表
      pickerOptions: {
        // 时间选择器的快选项
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      drawertrunklineFlagShow: false,
      isLoading: false,
      header_data_list: [],
      header_data_item_list: [],
      propMap: {},
      obj_list: {},
      HeaderData: [],
      derive_list: {},
    };
  },
  computed: {},
  watch: {
    $route: {
      handler(newV, oldV) {
        if (this.$route.query.type == 0) {
          this.getStockList();
          // console.log("待创建干线----------------------------");
        }
      },
      immediate: true,
      deep: true,
    },
  },
  mounted() {
    this.getStockList();
    this.provincectiy(); //地址库
    this.getWebsiteListDQFn();
    this.organizationBoxFn();
    this.getThermosphereType();
    this.Pagecreator();
    // this.$nextTick(() => {
    //   this.maxheight = document.body.clientHeight - this.$refs.multipleTableTrunkline.$el.offsetTop - 55
    // })
  },
  methods: {
    // 创建配送单
    handleClickCreate() {
      if (this.checkedOrders.length === 0) {
        this.$message({
          type: "warning",
          message: "请选中运单后进行操作",
        });
        return;
      }
      this.showDialog = true;
    },
    handleExport() {
      this.isLoading = true;
      const params = this.getStaySearchParams();
      waybillDispatchStayExport({
        ...this.derive_list,
        ids: (this.checkedOrders || []).map(Number),
      }).then((res) => {
        if (res.code === 10000) {
          this.reqUrl = "https://" + res.data.loaded_url;
          window.open(this.reqUrl);
          this.isLoading = false;
        }
      });
      sendClickTracker("P7-13");
    },
    async handleJump(scope) {
      const id = scope.id;

      let text = this.$router.resolve({
        name: "waybillDetail",
        query: { id, activeName: "1" },
      });
      window.open(text.href, "_blank");
    },
    handleSelectionChange(val) {
      // console.log(val);
      this.checkedOrders = val.map((item) => item.id);
      // console.log(this.checkedOrders, "this.checkedOrders");
    },
    getStaySearchParams() {
      return {
        page: this.paginations.pageIndex,
        page_size: this.paginations.pageSize,
        header_id: 1 + "",
        ...this.obj_list,
        // sender_city_id:
        //   this.sender_city_id[1] == "undefined" ? 0 : this.sender_city_id[1],
        // receiver_city_id:
        //   this.receiver_city_id[1] == "undefined"
        //     ? 0
        //     : this.receiver_city_id[1],
        // customer_id: this.customer_id + "",
        // creator_id: this.creator_id == "" ? 0 : this.creator_id,
        // ...this.orderSearch,
        // create_time: {
        create_time: {
          start_time: (this.orderSearch.create_time.start_time + "").slice(
            0,
            10
          ),
          end_time: (this.orderSearch.create_time.end_time + "").slice(0, 10),
        },
        // },
        // from_network_id_list:
        //   this.orderSearch.from_network_id != ""
        //     ? [
        //         this.orderSearch.from_network_id[
        //           this.orderSearch.from_network_id.length - 1
        //         ],
        //       ]
        //     : [],
        // to_network_id_list:
        //   this.orderSearch.to_network_id != ""
        //     ? [
        //         this.orderSearch.to_network_id[
        //           this.orderSearch.to_network_id.length - 1
        //         ],
        //       ]
        //     : [],
        // from_network_id: "",
        // to_network_id: "",
        // from_area_id: this.orderSearch.from_area_id + "",
        // to_area_id: this.orderSearch.to_area_id + "",
        // customer_area_id: this.orderSearch.customer_arae + "",
        // waybill_product_type: this.orderSearch.waybill_product_type.map(Number),
      };
    },
    getStockList() {
      const params = this.getStaySearchParams();
      this.derive_list = params;
      stayList(params).then((res) => {
        if (res.data.data != null) {
          this.orders = res.data.data;
          this.orders.unshift({});
          this.header_data_list = this.orders;
          this.HeaderData = res.data.item_list;
          this.Fntransformation(this.HeaderData);
          this.paginations.total = res.data.total;
          // this.$refs.multipleTableTrunkline.clearSelection();
          this.$emit("valueChanged", res.data.total);
        } else {
          this.orders = [];
          this.paginations.total = res.data.total;
        }
      });
    },
    objheader(obj) {
      var data = {
        header_id: 1 + "",
        ...obj,
      };
      this.obj_list = obj;
      this.derive_list = obj;
      stayList(data).then((res) => {
        this.header_data_list = res.data.data;
        if (res.code === 10000 && res.data.data !== null) {
          this.header_data_list.unshift({});
          this.paginations.total = res.data.total;
          this.paginations.pageSize = res.data.page_size;
          this.$emit("valueChanged", res.data.total);
        } else {
          this.header_data_list = [{}];
          this.paginations.total = res.data.total;
        }
      });
    },
    handleDelete(index, id, type) {
      this.handleJump(id);
    },
    handleDeleteType(value) {
      this.checkedOrders = value;
    },
    // 隐射函数
    Fntransformation(obj) {
      const result = {};
      for (const prop in obj) {
        if (obj.hasOwnProperty(prop)) {
          if (obj[prop].send_name !== "") {
            result[obj[prop].name] = obj[prop].show_name;
          } else {
            result[obj[prop].name] = obj[prop].name;
          }
        }
      }
      this.propMap = result;
    },
    // 每页条数改变
    handleSizeChange(val) {
      this.paginations.pageSize = val;
      this.getStockList();
    },
    // 当前页改regionList变
    handleCurrentChange(val) {
      this.paginations.pageIndex = val;
      this.getStockList();
    },
    handleCloseDialog(isUpdate = true) {
      this.showDialog = false;
      isUpdate && this.getStockList();
    },
    // 查询
    handleSearch() {
      this.getStockList();
    },
    // 重置
    handleReset() {
      // this.orderSearch = {
      //   waybill_no: "",
      //   status_list: [],
      //   is_over_temperature: "",
      //   create_time: {
      //     start_time: 1664553600000,
      //     end_time: new Date().getTime(),
      //   },
      //   time: [1664553600000, new Date().getTime()],
      //   sender_name: "",
      //   sender_phone: "",
      //   receiver_name: "",
      //   receiver_phone: "",
      //   receiver_company: "",
      //   waybill_product_type: [],
      //   from_region_name: "",
      //   to_region_name: "",
      // };
      // this.customer_id = "";objSettinUp
      // this.to_network_id = "";
      // this.creator_id = "";
      // this.sender_city_id = [];
      // this.receiver_city_id = [];
      // this.orderSearch.from_area_id = "";
      // this.orderSearch.to_area_id = "";
      // this.orderSearch.customer_arae = "";
      // this.orderSearch.from_network_id = [];
      // this.orderSearch.to_network_id = [];
      // this.orderSearch.waybill_product_type = [];
      this.$refs.TableHeaderList.childMethod();
      this.getStockList();
    },
    objSettinUp(val) {
      this.getStockList();
    },
    // 地址库()
    provincectiy() {
      regionList(0).then((res) => {
        this.childeprovicectiy(res.data);
      });
    },
    // 地址库改为二级
    childeprovicectiy(data) {
      data.forEach((item) => {
        item.next_level_data.forEach((iten) => {
          iten.next_level_data = undefined;
        });
      });
      this.areaData2 = data;
    },
    //客户所属大区
    async getWebsiteListDQFn() {
      let result = await reqWebsiteList({ branch_type: "3" });
      this.websiteListDQ = result.data;
    },
    // 网点信息
    organizationBoxFn() {
      let data = {
        show_employee: false, // 是否展示员工信息
        not_show_first_branch: 1,
      };
      organizationBox(data).then((res) => {
        if (res.code === 10000) {
          this.organizationBoxData = res.data;
        }
      });
    },
    // 承运类型
    async getThermosphereType() {
      let result2 = await getTransportsList({ is_all: false });
      this.transportsType = result2.data.data;
    },
    // 用户列表接口
    Pagecreator() {
      reqHandlersList().then((res) => {
        this.creator_List = res.data;
      });
    },
    // 揽收时间变化
    handleDateChange(val) {
      if (val) {
        this.orderSearch.create_time.start_time = timestamp10(val[0]);
        this.orderSearch.create_time.end_time = timestamp10(val[1]);
      } else {
        this.orderSearch.create_time.start_time = "";
        this.orderSearch.create_time.end_time = "";
      }
    },
    searchCustomerList(query) {
      //获取客户
      if (query !== "") {
        setTimeout(async () => {
          // let { router, router_id } = this.formData;
          let result = await customerPeople({
            name: query, // 名称
            id: "",
            is_send: "",
            is_receive: "",
          });
          this.customerList = result.data;
        }, 200);
      } else {
        this.customerList = [];
      }
    },
    rowStyle({ row }) {
      let jsonObj = {};
      if (row.is_over_temperature && row.is_over_temperature === "1") {
        jsonObj.background = "#ffc4c4 !important";
        return jsonObj;
      } else {
        return "";
      }
    },
    //干线费用修改
    drawertrunkline() {
      this.drawertrunklineFlagShow = true;
    },
    drawertrunklineFlagShowFn(data) {
      this.drawertrunklineFlagShow = data;
    },
    handleWaybillMessage(val) {
      const Fn = ["drawertrunkline"][val];
      this[Fn] && this[Fn]();
      if (val == "2") {
        this.drawertrunkline();
        sendClickTracker("P7-12");
      }
    },
    submitForm() {
      this.handleSearch();
    },
    titleFocus() {
      this.collClick = this.$refs.coll.setActiveNames;
      this.$refs.coll.setActiveNames = () => {};
    },

    titleBlur() {
      this.$refs.coll.setActiveNames = this.collClick;
    },
  },
};
</script>
<style lang="less" scoped>
/deep/ .el-collapse-item__header {
  border-bottom: none;
}
.allOrderContainer {
  padding: 10px;
  margin-top: 5px;
  margin-left: 5px;
  background-color: #fff;
  .orderHeader {
    background-color: #fff;
    .orderSearch {
      ::v-deep .el-form--inline .el-form-item__content {
        vertical-align: middle;
      }
      ::v-deep .el-collapse {
        border-top: none;
        border-bottom: none;
      }
    }
  }
  .actions {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    background-color: #fff;

    padding: 0px 15px 0px 0px;
    .el-button + .el-dropdown,
    .el-dropdown + .el-button {
      margin-left: 10px;
    }
  }
  .rightArea {
    background-color: #fff;
    width: 100%;
    text-align: end;
    // margin-bottom: 10px;
  }
}
</style>
